<!DOCTYPE html>
<html>
<head>
    <script src="../../../jpp/jquery/jquery-1.7.2.min.js"></script>
    <script src="../../../jpp/jquery/plugins/jquery.cookies-2.2.0.min.js"></script>
    <script src="../../../jpp/md5/md5-1.0.min.js"></script>
    <script src="../../../jpp/socket.io/io-0.9.4.min.js"></script>
    <script src="../../../jpp/openlayers/openlayers-2.11.min.js"></script>
    <script src="../../../jpp/openlayers/plugins/weolstk-0.1.min.js"></script>
    <script src="../../../jpp/jwim/jwim-0.6.min.js"></script>
    <script src='../../../jpp/weiran/weiran-0.1.min.js'></script>
    <script src='../../../jpp/weiran/plugins/weos-0.1.min.js'></script>
    <script src='../src/Device.js'></script>
    
    <style>html, body, #weiran {margin: 0; width: 100%; height: 100%;} </style>
<script>
    var layer, device;
    $(document).ready(function(){
        var os = new Weiran.OS('weiran', 'http://127.0.0.1:2080/');
        os.themeHost = "../../theme/";
        os.boot();
        
        layer = new OpenLayers.Layer.WeMarkers();
        os.getMap().addLayer(layer);
        
        device = new Weiran.Device({
            title: {en: 'Weiran Styled Device', 'zh-CN': 'Weiran Device'},
            lonlat: [120.190430, 30.187870],
            iconUrl: '../../theme/default/img/marker_icon_default.png',
            pageUrl: 'http://www.baidu.com',
            width: 900,
            height: 500,
            dragable: false
        });
        device.setOS(os);
        device.drawMarkerOn(layer);
    });
</script>
</head>
<body>
    <div id='weiran'></div>
</body>
</html>
